"use client";

// import { Carousel } from 'antd';
import Carousel from "react-elastic-carousel";
import React from "react";
import styles from "./index.module.less";
const list = [1, 2, 3, 4, 5];
const breakPoints = [
  { width: 1, itemsToShow: 1 },
  { width: 550, itemsToShow: 1, itemsToScroll: 2 },
  { width: 768, itemsToShow: 2 },
  { width: 1200, itemsToShow: 3 },
];
const App = () => (
  <>
    <Carousel breakPoints={breakPoints}>
      {list.map((item) => (
        <div key={item}>
          <h3 className={styles.content}>2</h3>
        </div>
      ))}
      {/* <div>
        <h3 >1</h3>
      </div>
      <div>
        <h3 style={contentStyle}>2</h3>
      </div>
      <div>
        <h3 style={contentStyle}>3</h3>
      </div>
      <div>
        <h3 style={contentStyle}>4</h3>
      </div> */}
    </Carousel>
  </>
);
export default App;
